<template>
    <div v-if="ishow">
        <el-button type="primary" @click="DutyRecordRef.showAdd(queryParams.jwApplydetailId, props.data)" class='mb-3'>
            <el-icon class="me-2">
                <Plus />
            </el-icon>
            新增登记
        </el-button>
        <el-table :data="SecurityChecktableData" show-overflow-tooltip border>
            <el-table-column prop="adddate" label="填写时间" min-width="160" />
            <el-table-column prop="adduserId" label="执勤人" min-width="80" />
            <el-table-column prop="startdate" label="执勤开始时间" min-width="170" />
            <el-table-column prop="enddate" label="执勤结束时间" min-width="170" />
            <el-table-column prop="dutydetail" label="特殊情况" min-width="200" />
            <el-table-column fixed="right" label="操作" min-width="190">
                <template #default="scope">
                    <el-button link type="primary" size="small"
                        @click="DutyRecordRef.showEdit(scope.row, 'Edit', props.data)">
                        <el-icon class="me-1">
                            <Edit />
                        </el-icon>
                        编辑
                    </el-button>
                    <el-button link type="primary" size="small"
                        @click="DutyRecordRef.showEdit(scope.row, 'See', props.data)">
                        <el-icon class="me-1">
                            <View />
                        </el-icon>
                        详情
                    </el-button>
                    <el-button link type="danger" size="small" @click="remove(scope.row)">
                        <el-icon class="me-1">
                            <Delete />
                        </el-icon>
                        删除
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <DutyRecordAdd ref="DutyRecordRef" @getList="getLists" />
    </div>
</template>
<script setup>
import { getCurrentInstance, onMounted } from "vue";
import { ElMessageBox } from 'element-plus'
const { proxy } = getCurrentInstance()
import { DutyRecordList, deletePDutyRecord } from "@/api/ApplyDetail/ApplyDetail";

import DutyRecordAdd from "@/components/BAManageDetail/BAManageDetailActive/DutyRecordAdd.vue";

const props = defineProps({
    data: {
        type: Object,
        required: true, // 如果这个属性是必需的
    },
})

const ishow = ref(false)
const SecurityChecktableData = ref([{}])
const DutyRecordRef = ref({})
const queryParams = ref({
    jwApplydetailId: ''
})
const paging = ref({
    // 页码
    pageNum: 1,
    // 分页数量
    pageSize: 10
})

onMounted(() => {
    nextTick(() => {
        ishow.value = true
    })
    if (props.data && props.data.jw_applydetail_id) {
        // 调用接口获取列表数据
        queryParams.value.jwApplydetailId = props.data.jw_applydetail_id
        getLists();
    }
})

// 获取列表
const getLists = async () => {
    await DutyRecordList(queryParams.value, paging.value).then(res => {
        SecurityChecktableData.value = res.rows
    })
}

const remove = async (row) => {
    ElMessageBox.confirm('确定删除此记录？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
    }).then(() => {
        deletePDutyRecord(row.jwDutyrecordId).then(res => {
            getLists()
        })
    }).catch(() => {
    });
}
// 关闭后的回调事件
const handleClick = () => {

}
</script>